<!DOCTYPE html>
<html>
<head>
	<title>Home</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link href="/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
	<!--theme-style-->
	<link href="/css/style.css" rel="stylesheet" type="text/css" media="all" />
	<!--//theme-style-->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
	<!--fonts-->
	<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>
	<!--//fonts-->
	<script src="/js/jquery.min.js"></script>
	<script src="/js/jquery.easydropdown.js"></script>
	<script src="/js/vue.js"></script>
	<script src="/js/jquery-1.12.4.js"></script>
	<script src="/js/isLogin.js"></script>
	<!--script-->
</head>
<body>
<!--header-->
<div class="header">
	<div class="top-header">
		<div class="container">
			<div class="top-header-left">
				<ul class="support">
					<li><a href="#"><label></label></a></li>
					<li id="loginInfo"><a href="#">请登录</a></li>
				</ul>
				<ul class="support">
					<li class="van"><a href="#"><label> </label></a></li>
					<li><a href="#">简单购物<span class="live">就在运动圈</span></a></li>
				</ul>
				<div class="clearfix"> </div>
			</div>
			<div class="top-header-right">
				<div class="down-top">
					<a href="" class="label">我的收藏</a>
				</div>
				<div class="down-top top-down">

					<a href="" class="label">我的订单</a>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<div class="bottom-header">
		<div class="container">
			<div class="header-bottom-left">
				<div class="logo">
					<a href="mall_index.html"><img src="/images/logo.png" alt=" " /></a>
				</div>
				<div class="search">
					<input type="text" value="" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '';}" >
					<input type="submit"  value="SEARCH">

				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="header-bottom-right">
				<ul class="men-grid">
					<!--<li><a href="login.html"><span> </span>YOUR ACCOUNT</a></li>-->
					<li class="login" id="login"><a href="/page/front_page/admin/login.htm"><span> </span>登陆</a>|</li>
					<li class="cart"><a href="/page/front_page/mall/mall_cart.html"><span> </span>购物车</a></li>
				</ul>
				<div class="sign-up-right" id="register">
					<a href="/page/front_page/admin/register.html">注册</a>
				</div>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
</div>
<!---->
<div class="tlinks">Collect from <a href="http://www.cssmoban.com/" ></a></div>
<div class="container">
	<div class="banner-menu">

		<div class="shoes-grid">
			<div class="wmuSlider example1 slide-grid">
				<!--<div  id="selectAllProductByRecommend">
                    <article  v-for="pro in list" style="position: absolute; width: 100%; opacity: 0;">
                         <div class="banner-matter">
                             <img class="img-responsive banner-bag" src="/images/bag.jpg" alt=" " />
                             <div class="banner-off">
                                 <h2>{{pro.name}}</h2>
                                 <span>FOR ALL PURCHASE <b>VALUE</b></span>
                                 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
                                 <a class="now-get" href="#">立即购买</a>
                             </div>
                             <div class="clearfix"> </div>
                         </div>
                      </article>
                   <article  style="position: absolute; width: 100%; opacity: 0;">
                        <div class="banner-matter">
                            <img class="img-responsive banner-bag" src="/images/bag.jpg" alt=" " />
                            <div class="banner-off">
                                <h2>{{pro.name}}</h2>
                                <span>FOR ALL PURCHASE <b>VALUE</b></span>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
                                <a class="now-get" href="#">立即购买</a>
                            </div>
                            <div class="clearfix"> </div>
                        </div>
                    </article>
                    <article  style="position: absolute; width: 100%; opacity: 0;">
                        <div class="banner-matter">
                            <img class="img-responsive banner-bag" src="/images/bag.jpg" alt=" " />
                            <div class="banner-off">
                                <h2>{{pro.name}}</h2>
                                <span>FOR ALL PURCHASE <b>VALUE</b></span>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
                                <a class="now-get" href="#">立即购买</a>
                            </div>
                            <div class="clearfix"> </div>
                        </div>
                    </article>


                  </div>-->
				<ul class="wmuSliderPagination">
					<li><a href="#" class="">0</a></li>
					<li><a href="#" class="">1</a></li>
					<li><a href="#" class="">2</a></li>
				</ul>
			</div>

			<script src="/js/jquery.wmuSlider.js"></script>
			<script>
                $('.example1').wmuSlider();
			</script>

			<!--<div class="shoes-grid-left" id="selectAllProductByRecommend">

                <div v-for="pro in list" class="con-sed-grid">
                    <div class="elit-grid">
                        <h4>{{pro.name}}</h4>
                        <span>FOR ALL PURCHASE VALUE</span>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, </p>
                    <a class="now-get" href="#">立即购买</a>
                </div>
                <a href="single.html"><img class="img-responsive shoe-left" :src="pro.extension3" alt=" " /></a>
                <div class="clearfix"> </div>
                </div>

                <div class="con-sed-grid sed-left-top">
                    <div class="elit-grid">
                        <h4>consectetur  elit</h4>
                        <span>FOR ALL PURCHASE VALUE</span>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, </p>
                    <a class="now-get" href="#">GET NOW</a>
                </div>
                <a href="single.html"><img class="img-responsive shoe-left" src="/images/wa.jpg" alt=" " /></a>
                <div class="clearfix"> </div>
                </div>

            </div>
            <div class="products">
                <h5 class="latest-product">推荐产品</h5>
                  <a class="view-all" href="mall_list.html">查看更多<span> </span></a>
            </div>-->
			<div class="product-left" id="selectAllProductByRecommend">
				<h1>推荐商品</h1>
				<span v-for="(pro,i) in list">
                          <div v-if="(i+1)%3==0" class="chain-grid grid-top-chain">
                            <a :href="'mall_detail.html?id='+pro.id"><img class="img-responsive chain" :src="pro.extension3" alt=" " /></a>
                            <span class="star"> </span>
                            <div class="grid-chain-bottom">
                                <h6>{{pro.name}}</h6>
                                <div class="star-price">
                                    <div class="dolor-grid">
                                        <span class="actual">{{pro.price}}</span>
                                        <span class="reducedfrom">{{pro.price*1.2}}</span>
                                    </div>
                                    <a class="now-get get-cart" :href="'javascript:onclick(addCart('+pro.id+'))'">加入购物车</a>
                                </div>
                            </div>
                        </div>
                        <div v-else class="chain-grid">
                            <a :href="'mall_detail.html?id='+pro.id"><img class="img-responsive chain" :src="pro.extension3" alt=" " /></a>
                            <span class="star"> </span>
                            <div class="grid-chain-bottom">
                                <h6>{{pro.name}}</h6>
                                <div class="star-price">
                                    <div class="dolor-grid">
                                        <span class="actual">{{pro.price}}</span>
                                        <span class="reducedfrom">{{pro.price*1.2}}</span>
                                    </div>
                                    <a class="now-get get-cart" :href="'javascript:onclick(addCart('+pro.id+'))'">加入购物车</a>

                                </div>
                            </div>
                        </div>
	   		        </span>
			</div>
			<div class="products">
				<h5 class="latest-product">推荐商品</h5>
				<a class="view-all" href="mall_list.html">查看更多<span> </span></a>
			</div>

			<div class="product-left" id="selectNewProduct">
					<span v-for="(pro,i) in list">
						<div v-if="(i+1)%3==0" class="chain-grid grid-top-chain">
	   		     		<a :href="'mall_detail.html?id='+pro.id"><img class="img-responsive chain" :src="pro.extension3" alt=" " /></a>
	   		     		<span class="star"> </span>
	   		     		<div class="grid-chain-bottom">
	   		     			<h6>{{pro.name}}</h6>
	   		     			<div class="star-price">
	   		     				<div class="dolor-grid">
		   		     				<span class="actual">{{pro.price}}</span>
	   		     				</div>
	   		     				<a class="now-get get-cart" href="#">加入购物车</a>
	   		     				<div class="clearfix"> </div>
							</div>
	   		     		</div>
	   		     	</div>

	   		     	<div v-else class="chain-grid">
	   		     		<a :href="'mall_detail.html?id='+pro.id"><img class="img-responsive chain" :src="pro.extension3" alt=" " /></a>
	   		     		<span class="star"> </span>
	   		     		<div class="grid-chain-bottom">
	   		     			<h6>{{pro.name}}</h6>
	   		     			<div class="star-price">
	   		     				<div class="dolor-grid">
		   		     				<span class="actual">{{pro.price}}</span>
	   		     				</div>
	   		     				<a class="now-get get-cart" href="#">加入购物车</a>
	   		     				<div class="clearfix"> </div>
							</div>
	   		     		</div>
	   		     	</div>
					</span>
				<!--<div class=" chain-grid">
                    <a href="single.html"><img class="img-responsive chain" src="/images/bottle.jpg" alt=" " /></a>
                    <span class="star"> </span>
                    <div class="grid-chain-bottom">
                        <h6>Lorem ipsum dolor</h6>
                        <div class="star-price">
                            <div class="dolor-grid">
                                <span class="actual">300$</span>
                                <span class="reducedfrom">400$</span>
                            </div>
                            <a class="now-get get-cart" href="#">ADD TO CART</a>
                            <div class="clearfix"> </div>
                    </div>
                    </div>
                </div>
                <div class=" chain-grid grid-top-chain">
                    <a href="single.html"><img class="img-responsive chain" src="/images/baa.jpg" alt=" " /></a>
                    <span class="star"> </span>
                    <div class="grid-chain-bottom">
                        <h6>Lorem ipsum dolor</h6>
                        <div class="star-price">
                            <div class="dolor-grid">
                                <span class="actual">300$</span>
                                <span class="reducedfrom">400$</span>
                            </div>
                            <a class="now-get get-cart" href="#">ADD TO CART</a>
                            <div class="clearfix"> </div>
                    </div>
                    </div>
                </div>-->
				<div class="clearfix"></div>
				<div class="products">
					<h5 class="latest-product">最新商品</h5>
					<a class="view-all" href="mall_list.html">查看更多<span> </span></a>
				</div>

			</div>



			<div class="clearfix"> </div>
		</div>
		<div class="sub-cate">
			<div class=" top-nav rsidebar span_1_of_left">
				<h3 class="cate">分类</h3>
				<ul class="menu">
					<li class="item1" id="selectShoe"><a href="#">鞋子<img class="arrow-img" src="/images/arrow1.png" alt=""/> </a>
						<ul class="cute">
							<li v-for="(shoe,i) in list" class='subitem"+(i+1)+"'><a :href="'mall_list.html?categoryLevel2Id='+shoe.id">{{shoe.name}}</a></li>
							<!--<li class="subitem1"><a href="mall_list3.html">休闲鞋</a></li>
                            <li class="subitem2"><a href="mall_list3.html">跑鞋</a></li>
                            <li class="subitem3"><a href="mall_list3.html">篮球鞋</a></li>-->
						</ul>
					</li>
					<li class="item2" id="selectUpper"><a href="#">上衣<img class="arrow-img " src="/images/arrow1.png" alt=""/></a>
						<ul class="cute">
							<li v-for="(upper,i) in list" class='subitem"+(i+1)+"'><a :href="'mall_list.html?categoryLevel2Id='+upper.id">{{upper.name}}</a></li>
							<!--<li class="subitem2"><a href="mall_list.html">运动短袖</a></li>
                            <li class="subitem3"><a href="mall_list.html">夹克</a></li>-->
						</ul>
					</li>
					<li class="item3" id="selectPants"><a href="#">裤子<img class="arrow-img img-arrow" src="/images/arrow1.png" alt=""/> </a>
						<ul class="cute">
							<li v-for="(pants,i) in list" class='subitem"+(i+1)+"'><a :href="'mall_list.html?parentId='+pants.id">{{pants.name}}</a></li>
							<!--<li class="subitem2"><a href="mall_list.html">篮球裤</a></li>
                            <li class="subitem3"><a href="mall_list.html">运动裤</a></li>-->
						</ul>
					</li>
					<li class="item4" id="selectBasketball"><a href="#">篮球<img class="arrow-img img-left-arrow" src="/images/arrow1.png" alt=""/></a>
						<ul class="cute">
							<li v-for="(basketball,i) in list" class='subitem"+(i+1)+"'><a :href="'mall_list.html?categoryLevel2Id='+basketball.id">{{basketball.name}}</a></li>
							<!--<li class="subitem1"><a href="mall_list.html">篮球配件</a></li>
                            <li class="subitem2"><a href="mall_list.html">双肩背包</a></li>
                            <li class="subitem3"><a href="mall_list.html">篮球</a></li>-->
						</ul>
					</li>
					<!--	<li>
                    <ul class="kid-menu">
                        <li><a href="mall_list.html">Tempus pretium</a></li>
                        <li ><a href="mall_list.html">Dignissim neque</a></li>
                        <li ><a href="mall_list.html">Ornared id aliquet</a></li>
                    </ul>
                </li>
                <ul class="kid-menu ">
                        <li><a href="mall_list.html">Commodo sit</a></li>
                        <li ><a href="mall_list.html">Urna ac tortor sc</a></li>
                        <li><a href="mall_list.html">Ornared id aliquet</a></li>
                        <li><a href="mall_list.html">Urna ac tortor sc</a></li>
                        <li ><a href="mall_list.html">Eget nisi laoreet</a></li>
                        <li><a href="mall_list.html">Faciisis ornare</a></li>
                        <li class="menu-kid-left"><a href="contact.html">Contact us</a></li>
                    </ul>-->
				</ul>
			</div>
			<!--initiate accordion-->
			<script type="text/javascript">
                $(function() {
                    var menu_ul = $('.menu > li > ul'),
                        menu_a  = $('.menu > li > a');
                    menu_ul.hide();
                    menu_a.click(function(e) {
                        e.preventDefault();
                        if(!$(this).hasClass('active')) {
                            menu_a.removeClass('active');
                            menu_ul.filter(':visible').slideUp('normal');
                            $(this).addClass('active').next().stop(true,true).slideDown('normal');
                        } else {
                            $(this).removeClass('active');
                            $(this).next().stop(true,true).slideUp('normal');
                        }
                    });

                });
			</script>
			<div class=" chain-grid menu-chain">
				<a href="single.html"><img class="img-responsive chain" src="/images/wat.jpg" alt=" " /></a>
				<div class="grid-chain-bottom chain-watch">
					<span class="actual dolor-left-grid">300$</span>
					<span class="reducedfrom">500$</span>
					<h6>Lorem ipsum dolor</h6>
				</div>
			</div>
			<a class="view-all all-product" href="mall_list.html">VIEW ALL PRODUCTS<span> </span></a>
		</div>
		<div class="clearfix"> </div>
	</div>
</div>
<!---->
<!--<div class="footer">
    <div class="footer-top">
        <div class="container">
            <div class="latter">
                <h6>NEWS-LATTER</h6>
                <div class="sub-left-right">
                    <form>
                        <input type="text" value="Enter email here"onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Enter email here';}" />
                        <input type="submit" value="SUBSCRIBE" />
                    </form>
                </div>
                <div class="clearfix"> </div>
            </div>
            <div class="latter-right">
                <p>FOLLOW US</p>
                <ul class="face-in-to">
                    <li><a href="#"><span> </span></a></li>
                    <li><a href="#"><span class="facebook-in"> </span></a></li>
                    <div class="clearfix"> </div>
                </ul>
                <div class="clearfix"> </div>
            </div>
            <div class="clearfix"> </div>
        </div>
    </div>
    <div class="footer-bottom">
        <div class="container">
            <div class="footer-bottom-cate">
                <h6>CATEGORIES</h6>
                <ul>
                    <li><a href="#">Curabitur sapien</a></li>
                    <li><a href="#">Dignissim purus</a></li>
                    <li><a href="#">Tempus pretium</a></li>
                    <li ><a href="#">Dignissim neque</a></li>
                    <li ><a href="#">Ornared id aliquet</a></li>
                    <li><a href="#">Ultrices id du</a></li>
                    <li><a href="#">Commodo sit</a></li>
                    <li ><a href="#">Urna ac tortor sc</a></li>
                    <li><a href="#">Ornared id aliquet</a></li>
                    <li><a href="#">Urna ac tortor sc</a></li>
                    <li ><a href="#">Eget nisi laoreet</a></li>
                    <li ><a href="#">Faciisis ornare</a></li>
                </ul>
            </div>
            <div class="footer-bottom-cate bottom-grid-cat">
                <h6>FEATURE PROJECTS</h6>
                <ul>
                    <li><a href="#">Curabitur sapien</a></li>
                    <li><a href="#">Dignissim purus</a></li>
                    <li><a href="#">Tempus pretium</a></li>
                    <li ><a href="#">Dignissim neque</a></li>
                    <li ><a href="#">Ornared id aliquet</a></li>
                    <li><a href="#">Ultrices id du</a></li>
                    <li><a href="#">Commodo sit</a></li>
                </ul>
            </div>
            <div class="footer-bottom-cate">
                <h6>TOP BRANDS</h6>
                <ul>
                    <li><a href="#">Curabitur sapien</a></li>
                    <li><a href="#">Dignissim purus</a></li>
                    <li><a href="#">Tempus pretium</a></li>
                    <li ><a href="#">Dignissim neque</a></li>
                    <li ><a href="#">Ornared id aliquet</a></li>
                    <li><a href="#">Ultrices id du</a></li>
                    <li><a href="#">Commodo sit</a></li>
                    <li ><a href="#">Urna ac tortor sc</a></li>
                    <li><a href="#">Ornared id aliquet</a></li>
                    <li><a href="#">Urna ac tortor sc</a></li>
                    <li ><a href="#">Eget nisi laoreet</a></li>
                    <li ><a href="#">Faciisis ornare</a></li>
                </ul>
            </div>
            <div class="footer-bottom-cate cate-bottom">
                <h6>OUR ADDERSS</h6>
                <ul>
                    <li>Aliquam metus  dui. </li>
                    <li>orci, ornareidquet</li>
                    <li> ut,DUI.</li>
                    <li >nisi, dignissim</li>
                    <li >gravida at.</li>
                    <li class="phone">PH : 6985792466</li>
                    <li class="temp"> <p class="footer-class">Copyright &copy; 2015.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p></li>
                </ul>
            </div>
            <div class="clearfix"> </div>
        </div>
    </div>
</div>-->
<script>
    var selectShoe = new Vue({
        el:'#selectShoe',
        data:{
            list:{}
        },
        mounted:function (){
            $.getJSON('/mallproductcategory/selectCateforyByParentId.json',{parentId:1},function(data){
                selectShoe.list=data;
            });
        }
    });
    var selectUpper = new Vue({
        el:'#selectUpper',
        data:{
            list:{}
        },
        mounted:function (){
            $.getJSON('/mallproductcategory/selectCateforyByParentId.json',{parentId:2},function(data){
                selectUpper.list=data;
            });
        }
    });

    var selectPants = new Vue({
        el:'#selectPants',
        data:{
            list:{}
        },
        mounted:function (){
            $.getJSON('/mallproductcategory/selectCateforyByParentId.json',{parentId:3},function(data){
                selectPants.list=data;
            });
        }
    });

    var selectBasketball = new Vue({
        el:'#selectBasketball',
        data:{
            list:{}
        },
        mounted:function (){
            $.getJSON('/mallproductcategory/selectCateforyByParentId.json',{parentId:4},function(data){
                selectBasketball.list=data;
            });
        }
    });

    //查询热搜表
    var selelctAllProductByRecommend = new Vue({
        el:'#selectAllProductByRecommend',
        data:{
            list:{}
        },
        mounted:function () {
            $.getJSON('/mallproduct/selectAllProductByRecommend.json',function (data) {
                selelctAllProductByRecommend.list=data;
            });
        }
    });

    //最新产品推荐
    var selectNewProduct = new Vue({
        el:'#selectNewProduct',
        data:{
            list:{}
        },
        mounted:function () {
            $.getJSON('/mallproduct/selectNewProduct.json',function (data) {
                selectNewProduct.list=data;
            })
        }
    });

    function addCart(sku){
        $.getJSON("/cart/add",{sku:sku,num:1},function (data) {
            alert(data.msg);
        })
    }

</script>
</body>
</html>